<template>
    <el-container>
        <el-header>
            <cli-title-student></cli-title-student>
        </el-header>
        <el-main>
            <div class="center">
                <el-row>
                    <el-col style="width: 750px; margin-top: 50px">
                        <el-tabs v-model="activeName">
                            <el-tab-pane label="博客" name="first">
                                <div class="insideTab">
                                    <bloglist :message="this.teacherId"></bloglist>
                                </div>
                            </el-tab-pane>
                            <el-tab-pane label="知识库" name="second">
                                <div class="insideTab">
                                    <repolist :message="this.teacherId"></repolist>
                                </div>
                            </el-tab-pane>
                        </el-tabs>

                    </el-col>
                    <el-col style="width: 400px; margin-left: 50px">
                        <teacher-info :message="this.teacherId"></teacher-info>
                        <calendar></calendar>
                    </el-col>
                </el-row>
            </div>
        </el-main>
        <el-footer>
            <page-footer></page-footer>
        </el-footer>
    </el-container>
</template>

<script>
    import CliTitleStudent from "../../../components/base/cliTitleStudent";
    import pageFooter from "../../../components/base/pageFooter";
    import calendar from "../../../components/calendar"
    import bloglist from "../../../components/list/bloglist";
    import repolist from "../../repository/repositorylist";
    import teacherInfo from "../../../components/info/teacherInfo"

    export default {
        name: "detail",
        components: {repolist, teacherInfo, bloglist, calendar, pageFooter, CliTitleStudent},
        data() {
            return {
                teacherId: '',
                // tabPosition: 'left',
                activeName: 'first',
            }
        },
        created() {
            this.teacherId = this.$route.params.teacherId;
            console.log(this.teacherId)
        },
        methods: {

        }
    }
</script>

<style scoped>
    .center{
        width: 1200px;
        margin: 0 auto;
    }
</style>